<!--
 * @Author: Liang 1931226988@qq.com
 * @Date: 2023-08-21 14:48:17
 * @LastEditors: Liang 1931226988@qq.com
 * @LastEditTime: 2023-08-21 15:34:04
 * @FilePath: \WanYi\src\components\v-navigation\navigation.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="v-navigation">
    <v-advertisement></v-advertisement>
    <div class="wrap">
      <div class="wrap_left">
        <image class="img" src="@/static/tabBar/首页-首页.png" mode="widthFix" @click="goHome" />
      </div>
      <div class="wrap_title">{{ title }}</div>
      <div class="wrap_right">
        <image class="img" src="@/static/image/搜索.png" mode="widthFix" />
        <image class="img" src="@/static/tabBar/_购物车.png" mode="widthFix" />
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
const props = defineProps(['title'])

// 回调函数区域
const goHome = () => {
    uni.switchTab({ url: '/pages/home/home' })
}
</script>

<style scoped lang="less">
.v-navigation {
  width: 100vw;
  position: fixed;
  z-index: 999;
  top: 0;
  background-color: #fff;
  .wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20rpx;
    .img {
      width: 60rpx;
    }
    .wrap_left {
        width: 160rpx;
      .img {
        width: 60rpx;
      }
    }
    .wrap_title {
        font-size: 40rpx;
    }
    .wrap_right {
        width: 160rpx;
        display: flex;
        justify-content: space-between;
    }
  }
}
</style>
